<template>
    <van-tabs v-model:active="active">
        <van-tab v-for="item in navList" :key="item.id" :title="item.text"></van-tab>
    </van-tabs>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import axios from 'axios'
const active = ref(0)
// TS的接口用于标记数据格式
// 定义接口数据类型要在定义数据之前
interface navListItem{
  id: string,
  text: string
}
// 频道标签页数据
const navList = ref<navListItem[]>([])

axios({
  url: '/navList',
  method: 'get'
}).then(res => {
  console.log(res)
  navList.value = res.data.result
})
</script>